<template>
  <div class="app-container">
    <el-card class="box-card">
      <template #header>
        <div class="card-header">
          <span>收货地址管理</span>
          <el-button type="primary" @click="handleAdd">新增地址</el-button>
        </div>
      </template>

      <div class="address-list">
        <el-empty v-if="addressList.length === 0" description="暂无收货地址" />
        <div v-else v-for="address in addressList" :key="address.addressId" class="address-item">
          <div class="address-content">
            <div class="address-header">
              <span class="name">{{ address.name }}</span>
              <span class="phone">{{ address.phone }}</span>
              <el-tag v-if="address.isDefault === '1'" type="success" size="small">默认地址</el-tag>
            </div>
            <div class="address-detail">
              {{ address.province }}{{ address.city }}{{ address.district }}{{ address.detail }}
            </div>
          </div>
          <div class="address-actions">
            <el-button link type="primary" @click="handleEdit(address)">编辑</el-button>
            <el-button link type="primary" v-if="address.isDefault !== '1'" @click="handleSetDefault(address)">设为默认</el-button>
            <el-button link type="danger" @click="handleDelete(address)">删除</el-button>
          </div>
        </div>
      </div>
    </el-card>

    <!-- 地址编辑对话框 -->
    <el-dialog
      :title="form.addressId ? '编辑地址' : '新增地址'"
      v-model="dialogVisible"
      width="500px"
      append-to-body
    >
      <el-form ref="formRef" :model="form" :rules="rules" label-width="80px">
        <el-form-item label="收货人" prop="name">
          <el-input v-model="form.name" placeholder="请输入收货人姓名" />
        </el-form-item>
        <el-form-item label="手机号" prop="phone">
          <el-input v-model="form.phone" placeholder="请输入收货人手机号" />
        </el-form-item>
        <el-form-item label="所在地区" prop="region">
          <el-cascader
            v-model="form.region"
            :options="regionOptions"
            placeholder="请选择所在地区"
          />
        </el-form-item>
        <el-form-item label="详细地址" prop="detail">
          <el-input
            v-model="form.detail"
            type="textarea"
            :rows="2"
            placeholder="请输入详细地址"
          />
        </el-form-item>
        <el-form-item>
          <el-checkbox v-model="form.isDefault" :true-label="'1'" :false-label="'0'">
            设为默认收货地址
          </el-checkbox>
        </el-form-item>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
 